
//获取数据库里的数据!是一个二维数组！
let url='http://localhost/lidu_project/php/goods/select.php';
	 ajaxPromise({
		 url:url,
	 }).then(function(res){
			 //显示的是一个二维数组
			 console.log(JSON.parse(res)); 
			 let arr=JSON.parse(res);
			 //处理二维数组！渲染布局！
			 let str="";
			 //这里不能用i,因为我的i不知道在哪里用过了！起冲突了！
			 for(var k=0;k<arr.length;k++){
				 str+=` <li>
				 			<a><img src="${arr[k][3]}"></a>
				 			<p>${arr[k][2]}</p>
				 			<b>${arr[k][4]}</b>
				 			<span>${arr[k][5]}元</span>
				 			<input type="button" value="加入购物车" index=${k} name=${arr[k][1]}>
				 		   </li> `
			 }
			 $('#show #goods ul').html(str);
	
		
	
	
	  //点击加入购物车的时候，相应的数据的num值会发生改变！要放到拿到数据的里面来
	  //为什么要拿！因为AJax是异步执行！放在外面异步执行！我的按钮这个时候还没有渲染出来呢！！
	  //这个是点中之点！！
		let url_1='http://localhost/lidu_project/php/goods/update.php';
		let a=$('#show #goods ul').children().length;
		//这个数组时为了计数用的。
		let att=Array(a);
		//数组的数全部赋值为0;
		for(var i=0;i<att.length;i++){
			att[i]=0;
		}
		console.log(att);
		
		
		//只有登录状态才可以进行购物车的点击
		let arr_1=window.location.search;
				//判断初始情况！登录成功会携带数据过去的！
				if(arr_1!=""){
				
				$('#show #goods ul').find('input').on('click',function(){
					//点击加入购物车，对应的数组值随之而动！
					att[$(this).attr('index')]++;
				    console.log(att);
					ajaxPromise({
						url:url_1,
						method:"post",
						data:{
							goodsId:$(this).attr('name'),
							num:att[$(this).attr('index')]
						}
					});
									
				  //点击不同的产品出现现在购物车上显示具体的数字
					 let add=0;
				  //设置的数组不为0，则表示一件商品加入了购物车
					for(var i=0;i<att.length;i++){
						if(att[i]!=0){add++;}
					}
					$('#logo #car a b').html(`${add}`);	
					//让悬浮的购物车也有反应！
					$('#link ul li b').html(`${add}`);	
					
					return false;
				})
				//同时点击加入购物车的时候会有特别效果
				$('#show #goods ul').find('input').on({
					mousedown:function(){
						$(this).css({
							background:'#FF6700',
							color:'#fff',
							// border:"solid 10px yellow"
						})
					},
					 mouseup:function(){
						$(this).css({
							background:'#ccc',
							color:'#000'
						})
						
					 }
					  
				})
			
				
				//如果登录过了，那么就可以点击！
				$('#show #goods ul').children('li').click(function(){
					console.log(111);
					//设计数据！[{},{},{}...]
					let obj={
							img:$(this).children('a').children('img').attr('src'),
							name:$(this).children('p').html(),
							msg:$(this).children('b').html(),
							price:$(this).children('span').html(),
							goodsId:$(this).children('input').attr('name')
				      	}
					
					let ops=localStorage.getItem('goodsMsg')?JSON.parse(localStorage.getItem('goodsMsg')):[];
					ops[0]=obj;
					//然后再将数据存到localStorage中
					localStorage.setItem('goodsMsg',JSON.stringify(ops));
					
					window.location.href='http://localhost/lidu_project/htmls/details/details.html';
				});
				
			
			
			
				
				
				}else{
					//非登录状态，点击加入购物是无效的！！
					$('#show #goods ul').find('input').click(function(){
						alert("请先登录您的账号");
						return false;
					})
				}
			
		
		
	  
	
	
	 })
		
		$('#link ul li').eq(1).click(function(){
			$(window).scroll(function(){
				
				$("#box").click(function(){
					//这里不可以写$(window)!因为我是让html回到上面而不是让window回到上面！
					//所以这里要写$("html");//document没有animate动画！根元素只有html有动画！
					$("html").animate({
						scrollTop:0
					},1000,'linear');
				});
			})
		})

